<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>连线题attachmentProblem</title>
  <link rel="stylesheet" href="./style/index.css">
</head>
<div class="container">
  <!-- 工具栏 -->
  <div class="tools">
    <div class="button reset">重置</div>
    <div class="button back">撤销</div>
    <div class="button read">查询</div>
    <div class="button check">纠错</div>
    <div class="button save">保存</div>
  </div>
  <div class="content">
    <!-- 左侧 -->
    <div class="list left">
      <div class="item" id="L1" data-ownership="L">水果</div>
      <div class="item" id="L2" data-ownership="L">动物</div>
      <div class="item" id="L3" data-ownership="L">汽车</div>
      <div class="item" id="L4" data-ownership="L">蔬菜</div>
    </div>
    <!-- 右侧 -->
    <div class="list right">
      <div class="item" id="R1" data-ownership="R">🥕</div>
      <div class="item" id="R2" data-ownership="R">🚗</div>
      <div class="item" id="R3" data-ownership="R">🐒</div>
      <div class="item" id="R4" data-ownership="R">🍌</div>
    </div>
    <!-- 实际连线标签 -->
    <canvas id="canvas" width="400" height="250">您的浏览器不支持Canvas，请下载最新版本</canvas>
    <!-- 模拟连线标签 -->
    <canvas id="backCanvas" width="400" height="250">您的浏览器不支持Canvas，请下载最新版本</canvas>
  </div>
</div>

</body>
<script src="./index.js"></script>
</html>